<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Anime Poster |design Template</title>
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Poppins:wght@800&display=swap">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>

<body>
    <div class="circle">
    </div>
    <div class="header">
        <div class="container">
            <div class="navbar">
                <div class="logo">
                    <img src="logo anime.png" alt="Anime logo" width="125px" height="60px">
                </div>
                <nav>
                    <ul id="MenuItems">

                        <li><a href="#Home">Home</a></li>
                        <li><a href="#Product">Products</a></li>
                        <li><a href="#About">About</a></li>
                        <li><a href="#Contact">Contact</a></li>
                        <li><a href="#Account">Account</a></li>
                    </ul>
                </nav>
                <img class="cart"
                    src="shopping-cart.png"  height="30">
                <img class="menu" src="menuicon.png" onclick="menutoggle()">
            </div>
        </div>
        <div class="row">
            <div class="col2">
                <h1>
                    Now It's Time!<br>With A Brand New Things.</h1>
                <p>Anime is not just a show it an emotion and fantasy, which has to come in real life</p>
                <a href="" class="btn">Explore Now &#8608;</a>

            </div>
            <div class="col2">
                <img src="https://i.pinimg.com/originals/62/3a/a8/623aa8f9933ee9a286871bf6e0782538.jpg"
                    alt="Anime image">
            </div>
        </div>
    </div>
    <!-- featured categories -->
    <div class="category">
        <div class="small-container">
            <div class="row">
                <div class="col3">
                    <img src="https://m.media-amazon.com/images/I/B1i3u9-Q-KS._CLa%7C2140%2C2000%7CB1s5odU-qVS.png%7C0%2C0%2C2140%2C2000%2B0.0%2C0.0%2C2140.0%2C2000.0._UL1500_.png"
                        width="400vh">
                </div>
                <div class="col3">
                    <img src="https://m.media-amazon.com/images/I/A13usaonutL._CLa%7C2140%2C2000%7C81ChCEQM1WL.png%7C0%2C0%2C2140%2C2000%2B0.0%2C0.0%2C2140.0%2C2000.0_AC_UL1500_.png"
                        width="400vh" alt="">
                </div>
                <div class="col3">
                    <img src="https://ih1.redbubble.net/image.1948284051.4192/ssrco,slim_fit_t_shirt,flatlay,101010:01c5ca27c6,front,wide_portrait,750x1000-bg,f8f8f8.jpg"
                        width="400vh" alt="">
                </div>
            </div>
        </div>
    </div>
    </div>
    <!-- featured product -->
    <h2 class="title">featured Products</h2>
    <div class="large-container">
        <div class="Product">
            <div class="rows">
                <div class="col4">
                    <img class="demo"
                        src="https://encrypted-tbn1.gstatic.com/shopping?q=tbn:ANd9GcQB2GLNzqDGR5w89rn_jn6fVe6ZI0WIAV_C6XG2zdp4vI_u_DNp_VfcatyHLnMGpVQmdrYBl6XOjdXbh0_Xijf0wyhJsYcs7RHSt9DepQp7LUBR0b_ZQy_L8Q&usqp=CAE">
                    <h4>Demon Slayer frame </h4>
                    <div class="rating">
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star-o"></i>
                    </div>
                    <p>$20.00</p>
                </div>
                <div class="col4">
                    <img
                        src="https://encrypted-tbn2.gstatic.com/shopping?q=tbn:ANd9GcQU2U00PDAljg45vCnQwDfbRnWmayo9Tgdv99Y4T3kSjnpf0BzLfgeaj7-EFp9i2se-Wxrh-dBSXBjI63f1rqMt8EqwrAa10BN-NJ8wx5ebVuf4kOQdhT-A9g&usqp=CAE">
                    <h4>Eren AOT Printed T-shirt </h4>
                    <div class="rating">
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star-o"></i>
                    </div>
                    <p>$24.02</p>
                </div>
                <div class="col4">
                    <div class="demi">
                        <img src="https://m.media-amazon.com/images/I/51d5RhGQ94L._AC_UL480_FMwebp_QL65_.jpg"
                            height="252px">
                    </div>
                    <h4>Wrist band from DS</h4>
                    <div class="rating">
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star-o"></i>
                    </div>
                    <p>$40.10</p>
                </div>
                <div class="col4">
                    <img src="https://m.media-amazon.com/images/I/61QIZRejJ+L._UY879_.jpg" height="252px">
                    <h4>Jujutsu Kaisen T-shirt </h4>
                    <div class="rating">
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star-o"></i>
                    </div>
                    <p>$25.90</p>
                </div>
            </div>
        </div>
    </div>
    <h2 class="title">Latest Products</h2>
    <div class="rows">
        <div class="col4">
            <img class="product"
                src="https://assets1.ignimgs.com/2020/08/03/anime-tshirts-header-1596483055162_160w.jpg?width=1280">
            <h4>Anime Quotes</h4>
            <div class="rating">
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>

            </div>
            <p>$34.10</p>
        </div>
        <div class="col4">
            <img class="product"
                src="https://encrypted-tbn2.gstatic.com/shopping?q=tbn:ANd9GcQU2U00PDAljg45vCnQwDfbRnWmayo9Tgdv99Y4T3kSjnpf0BzLfgeaj7-EFp9i2se-Wxrh-dBSXBjI63f1rqMt8EqwrAa10BN-NJ8wx5ebVuf4kOQdhT-A9g&usqp=CAE">
            <h4>Eren AOT Printed T-shirt </h4>
            <div class="rating">
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star-o"></i>
            </div>
            <p>$24.02</p>
        </div>
        <div class="col4">
            <div class="demi">
                <img src="https://m.media-amazon.com/images/I/51d5RhGQ94L._AC_UL480_FMwebp_QL65_.jpg" height="252px">
            </div>
            <h4>Wrist band from DS</h4>
            <div class="rating">
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star-o"></i>
            </div>
            <p>$40.10</p>
        </div>
        <div class="col4">
            <img src="https://m.media-amazon.com/images/I/61QIZRejJ+L._UY879_.jpg" height="252px">
            <h4>Jujutsu Kaisen T-shirt </h4>
            <div class="rating">
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star-o"></i>
            </div>
            <p>$25.90</p>
        </div>
        <div class="col4">
            <img
                src="https://encrypted-tbn2.gstatic.com/shopping?q=tbn:ANd9GcQU2U00PDAljg45vCnQwDfbRnWmayo9Tgdv99Y4T3kSjnpf0BzLfgeaj7-EFp9i2se-Wxrh-dBSXBjI63f1rqMt8EqwrAa10BN-NJ8wx5ebVuf4kOQdhT-A9g&usqp=CAE">
            <h4>Eren AOT Printed T-shirt </h4>
            <div class="rating">
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star-o"></i>
            </div>
            <p>$24.02</p>
        </div>
        <div class="col4">
            <div class="demi">
                <img src="https://m.media-amazon.com/images/I/51d5RhGQ94L._AC_UL480_FMwebp_QL65_.jpg" height="252px">
            </div>
            <h4>Wrist band from DS</h4>
            <div class="rating">
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star-o"></i>
            </div>
            <p>$40.10</p>
        </div>
        <div class="col4">
            <img src="https://m.media-amazon.com/images/I/61QIZRejJ+L._UY879_.jpg" height="252px">
            <h4>Jujutsu Kaisen T-shirt </h4>
            <div class="rating">
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star-o"></i>
            </div>
            <p>$25.90</p>
        </div>
        <div class="col4">
            <div class="demi">
                <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcT0OPdW7w_bsvH-kQSO5sqZPPU1LHGfY6l2Y6qIrtN7iek6Tsj30NyWmLQgdNr8InI-3y4&usqp=CAU"
                    height="252px">
            </div>
            <h4>Wrist band from DS</h4>
            <div class="rating">
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star"></i>
                <i class="fa fa-star-o"></i>
            </div>
            <p>$40.10</p>
        </div>
    </div>
    </div>

    <div class="offer">
        <div class="small-container"></div>
        <div class="rows">
            <div class="col-2">
                <img class="offer-img"
                    src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSw_cnBJrtiBAn8Zs_kIzOpZQzUgrfBUYmJjRzlAmlkTvkTJlIAQ-OKEnl_ZBKSuzkxi4g&usqp=CAU">

            </div>

            <div class="col-2">
                <p>Exclusively Available On <strong><u>Addicted to Anime Website</u></strong></p>
                <h2>Death Note Character "L" </h2>
                <small>He is an enigmatic, mysterious, and highly-esteemed
                </small><br>
                <a href=""class="bt">Buy Now &#8594;</a>
            </div>

        </div>
    </div>
    <!-- ------testimonial------ -->
    <div class="testimonial">
        <div class="small-container">
            <div class="rows">
                <div class="col-3">
                    <i class="fa fa-quote-left"></i>
                    <p>Eiichiro Oda is a Japanese manga artist and the creator of the series One Piece. With more than
                        500 million tankōbon copies in circulation worldwide, One Piece is both the best-selling manga
                        in history and the best-selling comic series printed in volume, in turn making Oda one of the
                        best-selling fiction authors..</p>
                    <div class="rating">
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                    </div>
                    <img
                        src="http://t1.gstatic.com/licensed-image?q=tbn:ANd9GcQ-jN__eNpfqVbU1k-kifLJ45o1ht9mSneMDBmtX9G7ynCfb4uV-Cs6R4Upnnd4i3Em">
                    <h3 class="name">Eiichiro Oda</h3>

                </div>
                <div class="col-3">
                    <i class="fa fa-quote-left"></i>
                    <p>Masashi Kishimoto is a Japanese manga artist. His manga series, Naruto, which was in
                        serialization from 1999 to 2014 and has sold over 250 million copies worldwide in 46 countries
                        as of May 2019. The series has been adapted into two anime and multiple films, video games, and
                        related media.</p>
                    <div class="rating">
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star"></i>
                        <i class="fa fa-star-o"></i>
                    </div>
                    <img
                        src="">
                    <h3 class="name">Masashi Kishimoto</h3>

                </div>
            </div>
        </div>

        <div class="brands">
            <div class="small-container">
                <div class="rows">
                    <div class="col-5">
                        <img src="bleach.png">
                    </div>
                    <div class="col-5">
                        <img src="download-removebg-preview.png">
                    </div>
                    <div class="col-5">
                        <img src="brand2.png">
                    </div>
                    <div class="col-5">
                        <img src="brand3.png">
                    </div>
                    <div class="col-5">
                        <img
                            src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRInh0gtP7r0sEApkjL0NQ9MuzM4sVczc6GuQ&usqp=CAU">
                    </div>
                </div>
            </div>
        </div>
        <div class="footer">
            <div class="container">
                <div class="rows">
                    <div class="footer-col1">
                        <h3>Dowload Our App</h3>
                        <p>Dowload App for Android and IOS mobile</p>
                        <div class="app-logo">
                            <img
                                src="https://www.freepnglogos.com/uploads/play-store-logo-png/play-store-logo-nisi-filters-australia-11.png">
                            <img
                                src="">
                        </div>
                    </div>
                    <div class="footer-col2">
                        <img src="logo anime.png">
                        <p>Our Purpose Is To Sustainably Make the Benefits of Anime Accessories </p>
                    </div>
                    <div class="footer-col3">
                        <h3>Useful Links</h3>
                        <ul>
                            <li>Coupons</li>
                            <li>Blog Posts</li>
                            <li>Return Policy</li>
                            <li>Join Affiliate</li>
                        </ul>
                    </div>
                    <div class="footer-col4">
                        <h3>Follow US</h3>
                        <ul>
                            <li>Facebook</li>
                            <li>Instagram</li>
                            <li>Twitter</li>
                            <li>Youtube</li>
                        </ul>
                    </div>
                </div>
                <hr>
                <p class="Copyright">Copyright 2022 - Amazing Website</p>
            </div>
        </div>
        <!-- js for toggle menu -->
        <script>
            var MenuItems = document.getElementById("MenuItems");
            MenuItems.style.maxHeight = "0px";
            function menutoggle() {
                if (MenuItems.style.maxHeight == "0px") {
                    MenuItems.style.maxHeight = "200px";

                }
                else {
                    MenuItems.style.maxHeight = "0px";
                }
            }

                setTimeout(menutime,4000);
                function menutime(){
                    document.getElementById("title").innerHTML;
                }
 
        </script>
</body>


</html>